<!DOCTYPE html>
<html>
    <head>
        <title>LOD terrain</title>
        <link href="css/style.css" rel="stylesheet">
        <script src="js/config.js"></script>
        <script data-main="../main" src="js/require.js"></script>
    </head>
    <body>
    <div id="container">
        <div id="threejs-container">Loading...</div>
        <div id="share-container">
            <h1>LOD terrain</h1>
            <br>
            <a href="https://twitter.com/share" class="twitter-share-button" data-text="Rendering large terrains using WebGL" data-via="pheeelicks">Tweet</a>
            <div class="g-plusone" data-size="medium"></div>
            <script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+'://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js,fjs);}}(document, 'script', 'twitter-wjs');</script>
            <script type="text/javascript">
             (function() {
              var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true;
              po.src = 'https://apis.google.com/js/platform.js';
              var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s);
              })();
             </script>
            <br>
            <a id=bloglink href="http://www.pheelicks.com/2014/03/rendering-large-terrains/">How does this work?</a>
            <p>Use mouse to adjust camera, click to switch mode</p>
         </div>
        <a href="https://github.com/felixpalmer/lod-terrain">
            <img style="position: absolute; top: 0; right: 0; border: 0;" src="https://s3.amazonaws.com/github/ribbons/forkme_right_red_aa0000.png" alt="Fork me on GitHub">
        </a>
    </div>
    </body>
</html>
